<template>
    <div>
        <div class="container">
            <div id="echart"></div>
        </div>
    </div>
</template>

<script>
import { getPipData } from "@/api/system/main";
export default {
    data() {
        return {
            option: {}
        }
    },
    // 页面初始化挂载dom
    mounted() {
        this.getLoadEcharts(1);
    },
    methods: {
        getLoadEcharts(type) {
            var myChart = this.$echarts.init(
                document.getElementById("echart")
            );
            getPipData(type).then(response=>{
                this.option=response.data;
                this.option && myChart.setOption(this.option);
            })
        }
    }
}
</script>

<style scoped>
.container {
    width: 800px;
    height: 500px;
    margin-left: 30px;
}

#echart {
    width: 100%;
    height: 100%;
}
</style>